<template>
	<div>
		<div class="header">


			<!-- title="智能供佛系统" -->
			<van-nav-bar style="  background: linear-gradient(90deg, #41A9B7,#4fd4e2, #41A9B7);height: 5rem;line-height: 5rem;">

				<span class="title" slot="title">刷卡</span>
			</van-nav-bar>
			<!-- <van-nav-bar title="智能供佛系统" style=" background: url(./images/系统标题部分.png);height: 80px;line-height: 80px; background-size:1142px 80px;background-repeat:no-repeat;">
				<van-icon name="search" slot="right" />
			</van-nav-bar> -->
		</div>



		<!-- /////////////////////////////////////////////////////////// -->
		<div class="content" >

			<h1 style="margin-top: 15.625rem; font-size: 1.5rem; text-shadow: 2px 0px 10px #FFFFFF;">
				{{mes}}
			</h1>



		</div>
	</div>

</template>

<script>
	export default {

		data() {
			return {
				mes: "请将您的卡片对准读卡感应器. . .",
				flag: true,
				cardTimeout:0,
			}
		},
		methods: {
			
			listenForCard(){
				
				let _this=this;
				

				let keyNumber=[48,49,50,51,52,53,54,55,56,57];
				let event_card_no='';
				/* 监听键盘事件-读卡 */
				function fn(e){
					//event_card_no='';
				
					for(let i =0;i<10;i++){
						if(e.keyCode==keyNumber[i]){
							event_card_no+=i;
							break;
						}else if(e.keyCode==13){
							console.log(event_card_no);
							//event_card_no='';	
							document.removeEventListener("keydown", fn);
							console.log("移除了该事件");
							_this.dost(event_card_no);
							break;
						}	
					}
	
				}
				
				
				
				document.addEventListener("keydown",fn);
				
			this.cardTimeout =setTimeout(()=>{
					document.removeEventListener("keydown", fn);
					this.$router.push({
						path: '/login'
					}); 
					this.$toast.fail("刷卡超时！")
				},10000);
				
				
		
				
			},
			/////////////////////////////////////////////////
			dost(card_no){
				
				//alert(card_no);
				
				
								
					//通过卡号查用户
					this.axios.post('https://mianmianshi.com/cms/temple/client/findUser', {
							'where': {
								'card_no': card_no,
								tid:this.$store.getters.getTid
							},
						})
						.then((res) => {
							if (res.data.id) {
								this.$toast.success({
									message: '识别成功！'
								});
								
								this.$store.commit('setUser', res.data) //数据都从仓库中取，以下路由传参方式不用了，为无效代码
								if (res.data.identity == "ADMIN") {
									this.$router.push({
										path: '/adminPage',
										query: res.data
									}); //this.$route.query用这个去接收参数
								} else if (res.data.identity == "CONSUMER") {
									this.$router.push({
										path: '/consumer',
										query: res.data
									}); //this.$route.query用这个去接收参数
								}
							
							} else {
							
							this.$toast.fail({
								message: '无效卡！'
							});
							
							this.$router.push({
								path: '/login'
							});
								
							}
							
						})
						.catch(function(error) {
							console.log(error);
						});
					////////////////////
								
								
								
				
				
				
				
				
				
				
				/* 
				this.axios.post('http://localhost:8088/readCard')
					.then((response) => {
						console.log(response);
						if (response.data != "timeout") {
							
							
						} else {
							this.mes = "刷卡超时！";
							//过一会
							let card_timeoutId = setTimeout(() => {
								this.$router.push("login");
								this.$toast.fail({
									message: '刷卡超时！'
								});
							}, 2000);
						}
				
					})
					.catch(function(error) {
						console.log(error);
					});
			 */}

		},
		created() {
			
			
			
		},
		mounted(){
			this.listenForCard();
		},
		destroyed() {
			clearTimeout(this.cardTimeout);
		}



	}
</script>

<style>
	
</style>
